<template>
	<view class="applicationSeal">
		<u-form :model="form" ref="uForm" label-width="160">
			<u-form-item label="印章类型" prop="sealType" required>
				<u-radio-group v-model="form.sealType" @change="changeSealType" >
					<u-radio name="entity"> 加盖实体章</u-radio>
					<u-radio name="electron"> 加盖电子章</u-radio>
				</u-radio-group>
			</u-form-item>
			<u-form-item label="申请单名称" prop="title" required v-show="form.title">
				<u-input v-model="form.title" border disabled/>
			</u-form-item>
			<u-form-item label="待盖章合同" prop="contractId" :border-bottom="contractList.length>0?false:true" required>
				<u-tag :text="item.title" type="success" closeable @close="delContract(item.id)" :key="index" v-for="(item, index) in contractList"/>
				<u-button slot="right" type="primary" size="mini" @click="addElectronContract" v-if="contractList.length!=1">+ 选择电子合同</u-button>
			</u-form-item>
			<u-form-item label="所属企业" prop="enterpriseName" required>
				<u-input v-model="form.enterpriseName" type="select" border :select-open="select.title=='所属企业'&&select.show" @click="showSelect('所属企业')" @clear="inputSelect('所属企业')"/>
			</u-form-item>
			<template v-if="form.enterpriseId">
				<u-form-item label="加盖电子章" prop="sealName" required>
					<u-input v-model="form.sealName" type="select" border :select-open="select.title=='加盖电子章'&&select.show" @click="showSelect('加盖电子章')" @clear="inputSelect('加盖电子章')"/>
				</u-form-item>
			</template>
			<template v-if="form.sealId">
				<u-form-item label="审批方式" prop="type" required>
					<u-radio-group v-model="form.type">
						<u-radio name="process">审批流程</u-radio>
						<u-radio name="user">审批人</u-radio>
					</u-radio-group>
				</u-form-item>
				<template v-if="form.type=='process'">
					<u-form-item label="审批流程" prop="processId" required>
						<u-input v-model="form.processId" type="select" border :select-open="select.show" @click="showSelect('选择审批流程')" />
					</u-form-item>
					<u-form-item label="组织:" v-if="form.isShowDepartment" prop="departmentId">
						<u-input v-model="form.departmentId" type="select" border :select-open="select.show" @click="showSelect('选择组织')" />
					</u-form-item>
				</template>
				<template v-else>
					<u-form-item label="审批人" prop="auditUser" required :border-bottom="managerList.length>0?false:true">
						<u-button slot="right" type="primary" size="mini" @click="secrecy_seal('电子章审批人')">选取</u-button>
					</u-form-item>
					<u-form-item v-if="managerList.length>0">
						<uni-list :border="false" style="width: 720rpx;">
							<uni-list-item :border="false" v-for="(item,index) in managerList" :key="index" :ellipsis="1"
								:title="item.label" clickable>
								<view slot="footer" style="color: #888;">
									<u-icon name="close-circle" size="40" style="margin-left: 20rpx;"
										@click="delManagerList(item.key)"></u-icon>
								</view>
							</uni-list-item>
						</uni-list>
					</u-form-item>
				</template>
			</template>
			
			<u-form-item label="加盖次数" prop="useCount" required>
				<u-number-box v-model="form.useCount" ></u-number-box>
			</u-form-item>
			<u-form-item label="申请说明" prop="remark">
				<u-input v-model="form.remark" type="textarea" border/>
			</u-form-item>
		</u-form>
		
		<u-select v-model="select.show" :list="select.list" :value-name="select.value" :label-name="select.label" :filterable="select.filterable" @confirm="confirmSelet"></u-select>
		<!-- #ifdef MP-WEIXIN -->
			<view class="submissionbtn">
				<u-button type="primary" size="medium" @click="submission" :loading="!btnOnoff" >立即提交</u-button>
			</view>
		<!-- #endif -->
	</view>
</template>

<script>
	let that
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		computed: {
			...mapGetters(['userInfo', 'api', 'userToken']),
			//计算图片属性
			computedFileType() {
				return (item) => {
					return that.$lizhao.file.lzGetFileType(item.type)
				}
			}
		},
		components: {},
		data() {
			return {
				btnOnoff: true, //控制多次提交
				form: {
					sealType: 'electron', //electron电子章，entity实体章
					title: '', //用章文件名
					enterpriseId:'',//企业id
					enterpriseName:'',//所属企业名
					sealId:'',//实体章id
					sealName:'',//实体章名
					contractId:'',//合同id
					type:'process',//审批方式process为审批流程 user审批人
					processId:'',//审批流程id
					managerIds:'',//审批人ids
					isShowDepartment:false,//当选取的审批流程里包含了直接主管审批时展示选择组织
					departmentId:'',//组织id
					remark: '', //申请说明
					useCount: 1, //加盖次数
				},
				rules: {
					title: [{required: true,message: '必填',trigger: ['change']}],
					sealType: [{required: true,message: '必填',trigger: ['change']}],
					processId: [{required: true,message: '必填',trigger: ['change']}],
					managerIds: [{required: true,message: '必填',trigger: ['change']}],
					enterpriseName: [{required: true,message: '必填',trigger: ['change']}],
					contractId: [{required: true,message: '必填',trigger: ['change']}],
					type: [{required: true,message: '必填',trigger: ['change']}],
				},
				electronList:[],//电子章列表
				contractList:[],//已选择的电子合同列表
				processList:[],//实体章的审批流程列表
				managerList:[],//已选择的审批人列表
				//当选取的审批流程里包含了直接主管审批时展示选择组织
				departmentList:[],//组织列表
				enterpriseList:[],//企业列表
				select:{
					title:'',
					show:false,
					list:[],
					value:'value',
					label:'label',
					filterable:true,
				}
			}
		},
		mounted() {
			that = this
			//查询企业列表
			this.getenterpriseList()
			//表单校验
			this.readyFn()
		},
		methods: {
			//回显
			echo(data){
				this.form= {
					sealType: 'electron', //electron电子章，entity实体章
					title: data.title, //用章文件名
					enterpriseId:data.enterpriseId,//企业id
					enterpriseName:data.enterpriseName,//所属企业名
					sealId:data.sealId,//实体章id
					sealName:data.sealName,//实体章名
					contractId:data.contractId,//合同id
					type:'process',//审批方式process为审批流程 user审批人
					processId:'',//审批流程id
					managerIds:'',//审批人ids
					isShowDepartment:false,//当选取的审批流程里包含了直接主管审批时展示选择组织
					departmentId:'',//组织id
					remark: '', //申请说明
					useCount: 1, //加盖次数
				}
				//console.log(data);
				//已选择的电子合同列表
				this.contractList=[data]
				//查询企业列表
				this.getenterpriseList()
				//获取电子章列表
				this.getElectronSealList()
			},
			//删除审批人
			delManagerList(key){
				that.managerList= that.managerList.filter(res => res.key != key);
				this.form.managerIds=that.managerList.map(item=>item.key)
			},
			//接收电子章审批人
			data_audit(e){
				this.managerList = e;
				this.form.managerIds=e.map(item=>item.key)
			},
			//电子章审批人
			secrecy_seal(val) {
				if (val == '电子章审批人') {
					uni.navigateTo({
						url: `../../template/mailList/mailList?type=电子章审批人&sealId=${that.form.sealId}&enterpriseId=${that.form.enterpriseId}&data=${JSON.stringify(that.managerList)}`
					});
				}
			},
			//切换组织
			changeDepartmentId(e){
				//console.log(e);
			},
			//切换审批流程
			changeProcessId(e){
				//选取的审批流程里包含了直接主管审批时展示选择组织
				if (e) {
					//清空之前选择的组织
					this.form.departmentId=''
					let obj = that.processList.find(res => res.id == e)
					//console.log(obj);
					if (obj&&obj.manager) {
						//查询用户所属组织列表
						that.getDepartments()
					}else{
						that.form.isShowDepartment = false
					}
				} else {
					that.form.isShowDepartment = false
				}
			},
			//接收加盖印章
			data_cover(res){
				that.form.device.push(res);
				//去重
				that.form.device = that.$lizhao.es6.arrayUnique(that.form.device, 'value')
			},
			//切换盖章类型
			changeSealType(data){
				this.$emit('changeSealType',data)
			},
			//点击提交
			navigationBarButtonTap(e){
				if (e.index == 0 && this.btnOnoff) {
					uni.showLoading({
						title: '提交中...',
						mask: false
					});
					//点击提交
					this.submission();
				}
			},
			// onReady方法触发
			readyFn(){
				this.$refs.uForm.setRules(this.rules);
			},
			//提交
			submission() {
				if(that.form.useCount>9999||that.form.useCount<1){
					uni.showToast({
						title: '加盖次数不在0-9999之间',
						icon:"none"
					});
					return
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						that.btnOnoff=false
						let req = {
							approvalIds:that.form.type=='user'?that.form.managerIds:[that.form.processId], //审批人(或审批流程)id列表
							contractId:that.form.contractId,//合同id
							enterpriseId:that.form.enterpriseId,//企业id
							departmentId: that.form.departmentId, //当审批流程有直接主管就要选择组织
							remark:that.form.remark,
							sealId: that.form.sealId, //加盖印章
							title: that.form.title, //用章文件名
							type: that.form.type, //审批方式 process:流程审批 user:用户审批
							useCount: that.form.useCount, //印章加盖次数
						};
						this.$u.post(that.api.GLOBAL_electronic_enterprise_application_createEnterpriseElectronicSealApplication, req,{'content-type':'application/json;charset=UTF-8'}).then(res => {
							uni.hideLoading()
							if (res.code == 200) {
								uni.showToast({
									title: res.msg,
									icon: 'success',
									duration: 1000
								});
								setTimeout(() => {
									uni.navigateBack({
										delta: 1
									});
								}, 1000);
							}
							that.btnOnoff=true
						});
					}
				});
			},
			//审批流程删除
			deleteAuditProcessFn(item) {
				this.form.auditProcess = []
				this.form.departmentId = ''
			},
			//选择select
			showSelect(title){
				this.select.show=true
				this.select.title=title
				if(title=='加盖电子章'){
					this.select.list=this.electronList
					this.select.label='name'
					this.select.value='sealId'
				}else if(title=='选择审批流程'){
					this.select.list=this.processList
					this.select.label='name'
					this.select.value='id'
				}else if(title=='选择组织'){
					this.select.list=this.departmentList
					this.select.label='name'
					this.select.value='id'
				}else if(title=='所属企业'){
					this.select.list=this.enterpriseList
					this.select.label='name'
					this.select.value='id'
				}
			},
			//清空选项
			inputSelect(title){
				if(title=='所属企业'){
					that.form.enterpriseId=''//企业id
					that.form.enterpriseName=''//所属企业名
					//清除电子合同
					this.clearContract()
				}else if(title=='加盖电子章'){
					this.form.sealId=''
					this.form.sealName=''
					//清空之前选择的审批人或者审批流程
					this.clearManager()
				}
			},
			//清除电子合同
			clearContract(){
				//清除电子合同
				this.form.contractId=''
				that.contractList= []
				//清除电子章
				that.electronList=[]
				this.form.sealId=''
				this.form.sealName=''
				//获取电子章列表
				this.getElectronSealList()
			},
			//清空之前选择的审批人或者审批流程
			clearManager(){
				//清空之前选择的审批人或者审批流程
				that.form.processId=''
				that.form.managerIds=''
				that.managerList=[]
				//获取流程数据
				this.getElectronOwner()
			},
			//确认选择select
			confirmSelet(e){
				//console.log(e);
				if(this.select.title=='加盖电子章'){
					this.form.sealId=e[0].value
					this.form.sealName=e[0].label
					//清空之前选择的审批人或者审批流程
					this.clearManager()
				}else if(this.select.title=='所属企业'){
					//如果选的值没变则不需要清除电子合同
					if(that.form.enterpriseId!=e[0].value){
						that.form.enterpriseId=e[0].value//企业id
						that.form.enterpriseName=e[0].label//所属企业名
						//清除电子合同
						this.clearContract()
					}
				}
				
			},
			//选择电子合同
			addElectronContract() {
				uni.navigateTo({
					url: '../../electronicSeal/contractList/contractList',
					events:{
						confirm(data){
							that.contractList=[data]
							that.form.contractId=data.contractId
							that.form.enterpriseId=data.enterpriseId
							that.form.enterpriseName=data.enterpriseName
							that.form.title=data.title
							//获取电子章列表
							that.getElectronSealList()
						}
					},
					success(res) {
						res.eventChannel.emit('pagePramas', { enterpriseId: that.form.enterpriseId })
					}
				});
			},
			//获取电子章列表
			getElectronSealList(){
				if(this.form.enterpriseId){
					this.$u.get(that.api.GLOBAL_electronic_enterprise_application_findAvailableElectronicList+'/'+this.form.enterpriseId, {page: false}).then(res => {
						if (res.code == 200&&res.data) {
							that.electronList = res.data;
						}else{
							that.electronList = []	
						}
					});
				}
			},
			//删除盖章合同
			delContract(key){
				//清除电子合同
				this.form.contractId=''
				that.contractList= []
				//清除电子章
				that.electronList=[]
				this.form.sealId=''
				this.form.sealName=''
				//清除企业
				this.form.enterpriseId=''
				this.form.enterpriseName=''
			},
			//获取电子章的流程数据
			getElectronOwner() {
				let req={
					page:false,
					enterpriseId:that.form.enterpriseId,
					sealId:that.form.sealId
				}
				this.$u.get(that.api.GLOBAL_electronic_enterprise_application_findFlowList, req).then(res => {
					if (res.code == 200&&res.data) {
						that.processList = res.data;
					}else{
						that.processList = []
					}
				});
			},
			//查询企业列表
			getenterpriseList(){
				let req={
					page:false
				}
				this.$u.get(that.api.GLOBAL_electronic_enterprise_findList, req).then(res => {
					if(res.code==200&&res.data){
						this.enterpriseList=res.data
					}else{
						this.enterpriseList=[]
					}
				});
			},
			
		}
	}
</script>

<style lang="scss">
	.applicationSeal {
		background-color: #fff;
		height: 100%;
		padding: 20rpx;
		box-sizing: border-box;
		padding:0 30rpx;
		.submissionbtn{
			width: 100%;display: flex;justify-content: center;margin-top: 40rpx;
		}
	}
</style>
